<template>
 <div class="box">
    <div class="jiankang">
        <jiankang :num1="msg1"></jiankang>
    </div>
    <div class="guzhang">
        <guzhang :num2="msg2"></guzhang>
    </div>
    <div class="weilianjie">
        <weilianjie :num3="msg3"></weilianjie>
    </div>
 </div>
  </template>
  
  <script>
    import { ref } from 'vue'
    const num1 = ref('hello vue3.x')
    const num2 = ref('hello vue3.x')
    const num3 = ref('hello vue3.x')

import jiankang from './icon_jiankang.vue'
import guzhang from './icon_guzhang.vue'
import weilianjie from './icon_weilianjie.vue'
import {getconditionnum} from '../../../networks/condition'
export default {
    components:{
        jiankang,
        guzhang,
        weilianjie
    },

  data() {
    return {
        msg1:"0",
        msg2:"0",
        msg3:"15"   
    };
  },
  mounted(){
    this.getconditionnum();
  },
  methods:{
    async getconditionnum(){
      await getconditionnum().then(res =>
      {
        this.msg1=res.data.num1;
        this.msg2=res.data.num2;
        this.msg3=res.data.num3;
      })
    }
}
}
  </script>
  
  <style lang='less' scoped>
 .box{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:center;
    width:100%;
    .jiankang{
        width:30%;
    }
    .guzhang{
        width:30%;
    }
    .weilianjie{
        width:30%;
    }
    
 }
  </style>